<template>
    <div class="wrapper">
            <div class="head">
                <v-head v-on:listenPathChange="listenPathChange"  :item="item"></v-head>
            </div>
           
            <transition name="move" mode="out-in" class="mainContent"><router-view v-on:itemChange="itemChange"></router-view></transition>
            
        
            <v-footer  ></v-footer>
           
    </div>
</template>
<script>
    import vHead from './Head.vue';
    import vFooter from './Footer.vue';
    import leftMenu from './LeftMenu.vue';
    //import jquery from '../tool/Global/jquery-1.10.2.min';
    import { copyright} from './../tool/Global/app-config.js';
    export default {
        mounted:function(){
            
        },
        data: function(){
            return {
                copyright: copyright,
                item:""
            }
        },
        components:{
            vHead,
            vFooter,
            leftMenu
        },
        methods:{
            listenPathChange(item){
                if(item=="show"){
                    this.$router.push("/show")
                }
                if(item=="manage"){
                    this.$router.push("/manager")
                }
                if(item=="dynamic"){
                    this.$router.push("/dynamic")
                }
            },
            itemChange(item){
                this.item = item;
            }
        }
    }
</script>
<style scoped>
    .head{
        height:75px;
        z-index: 999;
    }
    .main{
        width:100%;
    }
    .footer{
        clear:both;
        bottom:0px;
        background-color: #0888de;
        text-align: center;
        font-size: 15px;
        color: white;
        line-height: 50px;
        height:50px;
    }

</style>


